.Lottery {
    position: absolute;
    top: 17%;
    height: 72%;
    opacity: 1;
    width: 90%;
    left: 50%;
    margin-left: -45%;
}

.main {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 50%;
    margin-left: -50%;
}

.main_img {
    width: 800px;
    height: 500px;
    position: relative;
    top: 50%;
    margin-top: -250px;
    left: 50%;
    margin-left: -520px;
}

.main_img img {
    position: absolute;
    width: 100%;
}

.num {
    position: absolute;
    font-size: 56px;
    color: #ffe822;
    font-family: "微软雅黑";
    width: 100%;
    display: block;
    margin-top: 21%;
    /*text-align: center;*/
   margin-left: 240px;
}

.win {
    background-image: url(glassBg.png);
    background-repeat: no-repeat;
    position: absolute;
    left: 50%;
    padding: 10px 15px;
    width: 265px;
    height: 500px;
    background-size: 100% 100%;
    top: 50%;
    margin-left: 200px;
    margin-top: -250px;
}

.winTit {
    width: 100%;
}

.list {
    position: absolute;
    top: 80px;
    left: 30px;
    right: 30px;
    bottom: 90px;
    overflow: auto;
    padding: 0 10px;
}

.list li {
    color: #eb1d31;
    font-family: "微软雅黑";
    text-align: center;
    margin-bottom: 7px;
    padding: 6px 0;
    overflow: hidden;
    font-size: 21px;
    background-color: #FDDC12;
    border-radius: 30px;
    z-index: 9999;
}

.move1 {
    color: #eb1d31;
    font-family: "微软雅黑";
    text-align: center;
    margin-bottom: 10px;
    overflow: hidden;
    font-size: 21px;
    background-color: #FDDC12;
    border-radius: 30px;
    padding: 10px;
    left: 515px;
    width: 240px;
    height: 30px;
}

.move {
    position: absolute;
    display: none;
}

.move span {
    position: absolute;
}

.img1 {
    -webkit-animation-name: charector-2;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: step-start;
    -webkit-animation-duration: 300ms;
    /*background-image: url(img4a.png);*/
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    -webkit-animation-delay: 3s;
    opacity: 0;
}

@-webkit-keyframes charector-2 {
    0% {
        /*background-image: url(img4a.png);*/
        opacity: 0;
    }
    1% {
        /*background-image: url(img4a.png);*/
        opacity: 1;
    }
    50% {
        /*background-image: url(img4b.png);*/
        opacity: 1;
    }
    100% {
        /*background-image: url(img4a.png);*/
        opacity: 1;
    }
}

.img2 {
    -webkit-animation: img2 1.5s ease-in-out forwards 0.3s;
    animation: img2 1.5s ease-in-out forwards 0.3s;
    -webkit-transition-property: all;
    transition-property: all;
    opacity: 0;
}

@-webkit-keyframes img2 {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
        transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, .055, .675, .19);
        animation-timing-function: cubic-bezier(0.55, .055, .675, .19)
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.175, .885, .32, 1);
        animation-timing-function: cubic-bezier(0.175, .885, .32, 1)
    }
    100% {
        opacity: 1;
    }
}

@keyframes img2 {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
        -ms-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
        transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.55, .055, .675, .19);
        animation-timing-function: cubic-bezier(0.55, .055, .675, .19)
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        -ms-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        -webkit-animation-timing-function: cubic-bezier(0.175, .885, .32, 1);
        animation-timing-function: cubic-bezier(0.175, .885, .32, 1)
    }
    100% {
        opacity: 1;
    }
}

.img3 {
    -webkit-animation-name: charector-1;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: step-start;
    -webkit-animation-duration: 300ms;
    background-image: url(img2a.png);
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    -webkit-animation-delay: 3s;
    opacity: 0;
}

@-webkit-keyframes charector-1 {
    0% {
        background-image: url(img2a.png);
        opacity: 0;
    }
    1% {
        background-image: url(img2a.png);
        opacity: 1;
    }
    50% {
        background-image: url(img2b.png);
        opacity: 1;
    }
    100% {
        background-image: url(img2a.png);
        opacity: 1;
    }
}

@keyframes tada {
    0% {
        -webkit-transform: scale3d(1, 1, 1);
        -ms-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1)
    }
    10%,
    20% {
        -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
        -ms-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
        transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg)
    }
    30%,
    50%,
    70%,
    90% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
        -ms-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg)
    }
    40%,
    60%,
    80% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
        -ms-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
        transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg)
    }
    100% {
        -webkit-transform: scale3d(1, 1, 1);
        -ms-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
        opacity: 1;
    }
}

.moving {
    display: block;
}

.moving .move1 {
    -webkit-animation: move1 1s ease-in-out forwards;
    animation: move1 1s ease-in-out forwards;
    -webkit-transition-property: all;
    transition-property: all;
    opacity: 1;
    display: block;
}

@-webkit-keyframes move1 {
    0% {}
    100% {
        -webkit-transform: translate(100px, -80px) scale(0.4, 0.4);
        transform: translate(100px, -80px) scale(0.4, 0.4);
        opacity: 0;
    }
}

.img4 {
    -webkit-animation: img4 0.5s ease-in-out forwards 1.8s;
    animation: img4 0.5s ease-in-out forwards 1.8s;
    -webkit-transition-property: all;
    transition-property: all;
    opacity: 0;
}

@-webkit-keyframes img4 {
    0% {
        -webkit-transform: translateY(-80px);
        transform: translateY(-80px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes img4 {
    0% {
        -webkit-transform: translateY(-80px);
        transform: translateY(-80px);
        opacity: 0;
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }
}

.num {
    -webkit-animation: num 1s ease-in-out forwards 2s;
    animation: num 1s ease-in-out forwards 2s;
    -webkit-transition-property: all;
    transition-property: all;
    opacity: 0;
}

@-webkit-keyframes num {
    0% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        -webkit-transition-timing-function: ease-in;
        transition-timing-function: ease-in;
        opacity: 0
    }
    40% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        -webkit-transition-timing-function: ease-in;
        transition-timing-function: ease-in
    }
    60% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
        transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
        opacity: 1
    }
    80% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
        transform: perspective(400px) rotate3d(1, 0, 0, -5deg)
    }
    100% {
        -webkit-transform: perspective(400px);
        transform: perspective(400px);
        opacity: 1;
    }
}

@keyframes num {
    0% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        -ms-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        -webkit-transition-timing-function: ease-in;
        transition-timing-function: ease-in;
        opacity: 0
    }
    40% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        -ms-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        -webkit-transition-timing-function: ease-in;
        transition-timing-function: ease-in
    }
    60% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
        -ms-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
        transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
        opacity: 1
    }
    80% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
        -ms-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
        transform: perspective(400px) rotate3d(1, 0, 0, -5deg)
    }
    100% {
        -webkit-transform: perspective(400px);
        -ms-transform: perspective(400px);
        transform: perspective(400px);
        opacity: 1;
    }
}

.win {
    -webkit-animation: win 0.5s ease-in-out forwards 2.3s;
    animation: win 0.5s ease-in-out forwards 2.3s;
    -webkit-transition-property: all;
    transition-property: all;
    opacity: 0;
}

@-webkit-keyframes win {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

.btn {
    float: left;
    /*background-image: url(../images/btn1.png);*/
    background-repeat: no-repeat;
    background-size: 285px 57px;
    line-height: 42px;
    font-size: 17px;
    color: #333;
    font-family: "微软雅黑";
    margin-right: 16px;
}

.btn select {
    border: none;
    background-color: #fff;
    border-radius: 3px;
    width: 80px;
    height: 30px;
    line-height: 30px;
    color: #757575;
    cursor: pointer;
    font-family: "微软雅黑";
    text-align: center;
}

.btn input {
    border: none;
    background-color: #fff;
    border-radius: 3px;
    width: 80px;
    height: 30px;
    line-height: 30px;
    color: #757575;
    font-family: "微软雅黑";
    text-align: center;
}

.btn p {
    padding: 0;
    margin: 0;
    margin-left: 0;
    float: left;
}

.button button {
    background-color: #DE3E2E;
    border-radius: 5px;
    box-shadow: 0 2px 0px 0px rgba(0, 0, 0, 0.15), 0 -4px 0px 0px rgb(164, 27, 13) inset;
    display: block;
    text-align: center;
    width: 112px;
    padding: 6px 15px 10px 15px;
    font-size: 18px;
    color: #FFFFFF;
    font-family: "微软雅黑";
    float: left;
    border: none;
    cursor: pointer;
}

.button a:active {
    padding: 8px 15px 8px 15px;
    box-shadow: 0 2px 0px 0px rgba(0, 0, 0, 0.15), 0 0px 0px 0px rgba(255, 158, 37, 1) inset;
}

.button {
    width: 300px;
    box-sizing: border-box;
    left: 50%;
    position: absolute;
    bottom: 70px;
    margin-left: -150px;
    border-radius: 5px;
    padding: 0;
}

.tit {
    text-align: center;
    position: absolute;
    width: 100%;
}

.tit img {
    height: 200px;
}

@keyframes move1 {
    0% {
        transform: translate(0px, 0px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(-50%, -50%);
    }
    10% {
        transform: translate(10px, -20px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(-50%, -50%);
    }
    20% {
        transform: translate(30px, -40px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(-50%, -50%);
    }
    30% {
        transform: translate(50px, -60px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(-50%, -50%);
    }
    40% {
        transform: translate(100px, -80px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(-50%, -50%);
    }
    50% {
        transform: translate(150px, -100px) scale(1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(-50%, -50%);
    }
    60% {
        transform: translate(200px, -80px) scale(0.9) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(-50%, -50%);
    }
    70% {
        transform: translate(250px, -60px) scale(0.8) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(-50%, -50%);
    }
    80% {
        transform: translate(300px, -40px) scale(0.6) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(-50%, -50%);
    }
    90% {
        transform: translate(350px, -20px) scale(0.5) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(-50%, -50%);
    }
    100% {
        transform: translate(400px, 0px) scale(0.4) rotateX(0deg) rotateY(0deg) rotateZ(0deg) translate(-50%, -50%);
        opacity: 0;
    }
}

.clear {
    clear: both;
    display: block;
    overflow: hidden;
    height: 0;
    line-height: 0;
    font-size: 0;
}

.hide {
    display: none !important;
    visibility: hidden;
}

@media (min-width: 1900px) {
    .main_img {
        width: 1000px;
        height: 645px;
        margin-top: -320px;
        margin-left: -700px;
    }
    .num {
        font-size: 70px;
        margin-left: 310px;
    }
    .win {
        width: 365px;
        height: 648px;
        margin-left: 220px;
        margin-top: -350px;
    }
    .list li {
        font-size: 26px;
    }
    .list {
        top: 100px;
        left: 40px;
        right: 40px;
    }
    .button {
        bottom: 115px;
    }
}


/**/

::-webkit-scrollbar-thumb {
    background-color: #FCDB11 !important;
}
